<?xml version="1.0" encoding="iso-8859-1"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>FusionCharts v3 Documentation</title>
<link rel="stylesheet" href="Style.css" type="text/css" />
</head>

<body>
<table width="98%" border="0" cellspacing="0" cellpadding="3" align="center">
  <tr> 
    <td><h2 class="pageHeader">Plotting charts from data contained in Microsoft Word </h2></td>
  </tr>
  <tr> 
    <td valign="top" class="text"><p>In our previous example, we had seen how to plot charts from data contained in Excel sheets. Here, we'll see how to create charts from data contained in Microsoft Word Tables. Note that you can convert only tabular data from Microsoft Word to FusionCharts charts. Let's quickly see an example.</p>
    <p>Consider the following table in MS Word where we've our monthly sales data stored: </p></td>
  </tr>
  <tr>
    <td valign="top" class="text"><img src="Images/GUI_Word_1.gif" width="376" height="505" /></td>
  </tr>
  <tr>
    <td valign="top" class="text">To create a chart from this data, you'll now need to select this data and copy to clipboard. Select only the data rows (and NOT the headers) as under and copy it to clipboard by pressing Ctrl + C. </td>
  </tr>
  <tr>
    <td valign="top" class="text"><img src="Images/GUI_Word_2.gif" width="376" height="505" /></td>
  </tr>
  <tr>
    <td valign="top" class="text"><p>Now, we need to paste this data in our XML Generator Utility. Launch the XML Generator utility and select the second option &quot;<span class="codeInline">I want to copy/paste my data from spreadsheet / table</span>&quot;. </p>    </td>
  </tr>
  <tr>
    <td valign="top" class="text"><img src="Images/GUI_Excel_4.jpg" width="478" height="179" class="imageBorder" /></td>
  </tr>
  <tr>
    <td valign="top" class="text">In the text area that you now get, paste the data that's in your clipboard. It should look as under: </td>
  </tr>
  <tr>
    <td valign="top" class="text"><img src="Images/GUI_Excel_5.jpg" width="600" height="451" /></td>
  </tr>
  <tr>
    <td valign="top" class="text"><p>Here, select &quot;<span class="codeInline">Tab</span>&quot; as delimiter. </p>
    <p>If your delimiter is different from Tab, you you need to judge your delimiter and then set it accordingly. Delimiter is the character that separates two different data items on a single row of data. For example, in our above data, our month names and revenue figures are separated by a <span class="codeInline">Tab</span> character. So, we select <span class="codeInline">Tab</span> as the delimiter. </p>
    <p>Now, you've two options to convert it into XML:</p>
    <ol>
      <li>You can directly convert this data into XML without making any changes to it.</li>
      <li>Or, you can edit this data in the grid and then convert it to XML.</li>
    </ol>
    <p>To choose option 1, click on &quot;<span class="codeInline">Convert to XML</span>&quot; button. You'll instantly get the XML as under: </p>    </td>
  </tr>
  <tr>
    <td valign="top" class="text"><img src="Images/GUI_Excel_12.jpg" width="600" height="451" /></td>
  </tr>
  <tr>
    <td valign="top" class="text"><p>You can now configure the chart properties or generate HTML from here as explained in earlier sections. </p>
      <p>Going back to previous step, if you had wished to edit the data before conversion, you can click on &quot;<span class="codeInline">Edit and Convert</span>&quot; button. This lets you edit your data in a grid as under: </p></td>
  </tr>
  <tr>
    <td valign="top" class="text"><img src="Images/GUI_Excel_6.jpg" width="600" height="451" /></td>
  </tr>
  <tr>
    <td valign="top" class="text">After editing your data, you can now click on &quot;<span class="codeInline">Convert to XML</span>&quot; button to generate the XML and finally chart. </td>
  </tr>
</table>
</body>
</html>
